<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>Ajax</title>
	<style type="text/css">
		.profile{
			width: 400px;
			margin: 0 auto;
			height: 400px;
			border: 1px solid red;
		}
	</style>
</head>
<body>
	<div class="profile">
		<p><span>姓名：</span><span id="sname"></span></p>
		<p><span>年龄：</span><span id="sage"></span></p>
		<p><span>朋友：</span><span id="sfriends"></span></p>		
	</div>

	省<select>
		<option>广西</option>
	</select>
	市<select>
		<option>柳州</option>
	</select>
	区<select>
		<option>鱼峰</option>
	</select>



	<script type="text/javascript" src="js/jquery.js"></script>
	<script type="text/javascript">
		$.get('student.json',function(res){
			$('#sname').text(res.name);
			$('#sage').text(res.age);

			var fname='';
			for(var i=0;i<res.friends.length;i++){
				fname +=res.friends[i].name +"  ";
			}

			$('#sfriends').text(fname);			
		});
		

	</script>

</body>
</html>